<script lang="ts" setup name="GrandChild">
    import { inject } from 'vue';

    let { money: grandFatherMoney, updateMoney: updateGFMoney } =
        inject('money', { money: 0, updateMoney: (value: number) => {} });  // 第二个参数时默认值，当money没有找到时生效
    let grandFatherCar = inject('car', { brand: 'unknown', price: 0 });
    // 上面通过提供默认值的方式，让TS推断出grandFatherCar的类型
</script>

<template>
    <div class="grandchild">
        <h2>孙组件</h2>
        <div>爷爷的银子：{{ grandFatherMoney }}</div>
        <div>爷爷有一辆{{ grandFatherCar.brand }}汽车，价值{{ grandFatherCar.price }}W</div>
        <button @click="updateGFMoney(-1)">花爷爷的钱</button>
    </div>
</template>

<style scoped>
    .grandchild {
        background-color: blueviolet;
        border-radius: 10px;
        padding: 5px 10px;
    }
</style>